<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="../common/css/insert.css">
<title>bookInsert</title>
</head>
<body>

	<div class="form-group">
		
		<form id="jvForm" action="o_save.shtml" method="post"
			enctype="multipart/form-data">
				<label>请选择将要上传的图片：</label><br>
				<img width="200" height="300" id="allUrl" /><br>
				<!-- 在选择图片的时候添加事件，触发Ajax异步上传 -->
				<input name="uploadfile" type="file" onchange="uploadPic()">
		</form>
	</div>


	<div id="basic-info">
		<form>	
		<div class="form-group">
			<label>图书封面路径：</label> <input class="form-control"
				id="cover" type="text" name="book_cover" placeholder="输入图书封面路径">
		</div>
		<div class="form-group">
			<label>书名：</label> <input class="form-control"
				id="name" type="text" name="book_name" placeholder="输入书名">
		</div>
		<div class="form-group">
			<label>作者：</label> <input class="form-control"
				id="author" type="text" name="book_author" placeholder="输入作者">
		</div>
		<div class="form-group">
			<label>简介：</label> <input class="form-control"
				id="description" type="text" name="book_des" placeholder="输入简介">
		</div>
		<div class="form-group">
			<label>星数：</label> <input class="form-control"
				id="star" type="text" name="book_star" placeholder="输入星数">
		</div>
		<div class="form-group">
			<label>类型：</label> <input class="form-control"
				id="type" type="text" name="book_type" placeholder="输入类型">
		</div>
		<input class="btn btn-primary" type="button" value="添加" onclick="toUpload()">
		<input class="btn btn-danger" type="reset" value="重置">
		</form>
	</div>


	<!-- Ajax异步上传图片 -->
	<script type="text/javascript">
		var cover_url;
		function uploadPic() {
			// 上传设置  
			var options = {
				// 规定把请求发送到那个URL  
				url : "../uploadBookcover.action",
				// 请求方式  
				type : "post",
				// 服务器响应的数据类型  
				dataType : "json",
				// 请求成功时执行的回调函数  
				success : function(data) {
					// 图片显示地址  
					alert("测试");
					$("#allUrl").attr("src", "../"+data.cover);
					$("#cover").val(data.cover);
				}
			};

			$("#jvForm").ajaxSubmit(options);
		}

		function toUpload() {
			
			var bookCover = $("#cover").val();
			var bookName = $("#name").val();
			var bookAuthor = $("#author").val();
			var bookDes = $("#description").val();
			var bookStar = $("#star").val();
			var bookType = $("#type").val();
			var jo = {
				"cover" : bookCover,
				"name" : bookName,
				"author" : bookAuthor,
				"description" : bookDes,
				"star" : bookStar,
				"type" : bookType
			};

			$.ajax({
				type : "post",
				url : "../uploadBook.action",
				dataType : "json",
				data : jo,
				success : function(data, textStatus) {
					//<!--变成字节流>
					var obj = eval(data);
					if (obj == "" || obj == null) {
						return false;
					} else {
						if (obj.status == "succeed") {
							alert("添加成功");
						} else if (obj.status == "failed") {
							alert("失败");
						}

					}

				}
			});
		}
	</script>
	<script src="../js/jquery-1.9.1.min.js"></script>  
	<script src="../js/jquery.form.js"></script> 
</body>

</html>